<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../day8/jquery-3.4.1.min.js"></script>
		<script>
		$(function(){
			$("#slideup").click(function(){
				$("img").slideUp(2000);
			});
			$("#slidedown").click(function(){
				$("img").slideDown(2000);
			});
			$("#fadein").click(function(){
				$("img").fadeOut(2000);
			});
			$("#fadeout").click(function(){
				$("img").fadeIn(2000);
			});
			//代码触发事件
			$("img").click(function(){
				$("#slideup").triggerHandler("click");
			});
		})
		</script>
	</head>
	<body>
		<div id="d1">
			<img src="../day4/1621998059577218.jpg" width="1200px"/>
		</div>
		<p>
			<button type="button" id="slideup">slide up</button>
			<button type="button" id="slidedown">slide down</button>
			<button type="button" id="fadein">fade in</button>
			<button type="button" id="fadeout">fade out</button>
		</p>
	</body>
</html>
